@mixin noisyPoint() {
  background: repeating-radial-gradient(#000 0 0.0001%, #fff 0 0.0002%) 50% 0 /
      2500px 2500px,
    repeating-conic-gradient(#000 0 0.0001%, #fff 0 0.0002%) 60% 60% / 2500px
      2500px;
  background-blend-mode: difference;
}

@mixin oldPhotos($opacity: 0.6) {
  display: inline-flex;
  position: relative;
  // 将图像转换为棕褐色效果
  filter: sepia(100%);
  &::before {
    content: "";
    position: absolute;
    inset: 0;
    // 设置背景为线性渐变，重复的径向渐变和重复的锥形渐变
    background: linear-gradient(#000a, #000a),
      // 设置径向渐变，从50% 0开始，大小为2500px 2500px
      repeating-radial-gradient(#000 0 0.0001%, #fff 0 0.0002%) 50% 0 / 2500px
        2500px,
      // 设置锥形渐变，从60% 60%开始，大小为2500px 2500px
      repeating-conic-gradient(#000 0 0.0001%, #fff 0 0.0002%) 60% 60% / 2500px
        2500px;
    // 设置背景混合模式为正常和差值
    background-blend-mode: normal, difference;
    // 设置与父元素的混合模式为叠加
    mix-blend-mode: overlay;
    opacity: $opacity;
  }
}

@mixin noisyText($fsz: 100px) {
  // 设置字体大小
  font-size: $fsz;
  // 设置字体颜色
  color: #0000;
  // 调用noisyPoint()函数
  @include noisyPoint();
  // 设置混合模式
  mix-blend-mode: lighten;
  // 设置背景裁剪
  background-clip: text;
}
